import React, {useState, useEffect, useCallback} from 'react'
import { useParams } from 'react-router-dom'
import { InputNumber, Button, message } from 'antd'
import Nav from '../../components/nav'
import { fetchData } from '../../request'
import './index.scss'

const orderPrice = {
    "5": "199",
    "50": "1690",
    "500": "14500",
    "50000": "1350000",
    "250000": "6250000",
    "500000": "11500000"
}

const orderData = [
    {
        key: "5", value: "199"
    },
    {
        key: "50", value: "1690"
    },
    {
        key: "500", value: "14500"
    },
    {
        key: "50000", value: "1350000"
    },
    {
        key: "250000", value: "6250000"
    },
    {
        key: "500000", value: "11500000"
    }
]

const Order = props => {

    const [url, setUrl] = useState({})
    const { type } = useParams()

    const handleChange = val => {
        setUrl({
            method: "post",
            url: "/makeUp/order/add",
            data: {
                count: val,
                price: 0,
                name: localStorage.getItem('userName'),
                parentId: localStorage.getItem("parentId"),
                type: type
            }
        })
    } 
    
    const onSubmit = useCallback(() => {
        fetchData(url).then(res => {
            if(res.code === 200){
                message.success("订单已生成")
            }else{
                message.error(res.msg)
            }
        })
    }, [url])

    return (
        <div className="order-page">
            <div className="bg"></div>
            <Nav backUrl="/orderType"></Nav>
            <div className="order-box">
                <InputNumber defaultValue={0} step={5} onChange={handleChange} />
                <Button type="primary" onClick={onSubmit}>提交</Button>
            </div>
        </div>
    )
}

export default Order;
